<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>视频识别预警 - 多模态网络诈骗识别和预警系统</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="container">
        <!-- 左侧导航栏 -->
        <nav class="sidebar">
            <div class="logo">
                <h2>多模态网络诈骗识别和预警系统</h2>
            </div>
            <ul class="nav-links">
                <li><a href="text.html" class="nav-link">文字识别预警</a></li>
                <li><a href="audio.html" class="nav-link">语音识别预警</a></li>
                <li><a href="image.html" class="nav-link">图像识别预警</a></li>
                <li><a href="video.html" class="nav-link">视频识别预警</a></li>
            </ul>
        </nav>
        
        <!-- 主要内容区域 -->
        <main class="main-content">
            <div class="header-section">
                <h1>智能视频诈骗识别</h1>
                <p class="subtitle">基于深度学习的多维度视频分析，为您提供精准的诈骗风险评估</p>
            </div>

            <div class="features-grid">
                <div class="feature-card">
                    <h3>多模态分析</h3>
                    <p>同时分析视频、音频和文字信息</p>
                </div>
                <div class="feature-card">
                    <h3>实时监测</h3>
                    <p>快速识别视频中的可疑内容</p>
                </div>
                <div class="feature-card">
                    <h3>场景识别</h3>
                    <p>智能识别诈骗相关场景特征</p>
                </div>
                <div class="feature-card">
                    <h3>语音分析</h3>
                    <p>检测视频中的诈骗话术特征</p>
                </div>
            </div>

            <div class="analysis-section">
                <form class="upload-container" id="uploadForm" onsubmit="return false;">
                    <div class="input-group">
                        <label for="videoType">检测类型：</label>
                        <select id="videoType" class="select-style">
                            <option value="视频文件检测">视频文件检测</option>
                        </select>
                    </div>
                    
                    <div class="upload-area" id="dropZone">
                        <input type="file" id="videoInput" accept="video/*" style="display: none;">
                        <p>点击或拖拽视频文件到此处</p>
                        <p class="small">支持的格式：MP4, AVI, MOV</p>
                        <p class="small">单个文件大小限制：500MB</p>
                    </div>
                    
                    <div id="videoPreview" style="display: none; margin: 20px 0;">
                        <video id="videoPlayer" controls style="width: 100%; max-height: 400px; border-radius: 5px;"></video>
                        <div class="video-info" style="margin-top: 10px; color: #666;">
                            <span id="videoDuration">时长：--:--</span>
                            <span style="margin: 0 10px;">|</span>
                            <span id="videoSize">大小：-- MB</span>
                        </div>
                    </div>
                    
                    <button class="btn analyze-btn" type="button" id="analyzeBtn">开始分析</button>
                </form>

                <div class="result-container" id="resultArea">
                    <div style="display: flex; justify-content: space-between; align-items: center;">
                        <h3>分析结果</h3>
                        <button class="btn" id="downloadBtn" style="display: none;" onclick="downloadResult()">
                            下载结果
                        </button>
                    </div>
                    <div id="analysisResult"></div>
                </div>
            </div>
        </main>
    </div>
    <script src="js/common.js"></script>
    <script src="js/video.js"></script>
</body>
</html> 